diligent-next/pages/single-data/[dataId].js

import DataDetailsCard from '../../components/cards/data-details-card/DataDetailsCard';
import { getDataIds } from '../../requests/dataIdsRequest';
import { getSingleData } from '../../requests/singleDataRequest';

function SignelDataPage(props) {
  const data = props.selectedData;

  if (!data) {
    return <h1>No data!</h1>;
  }
  return <DataDetailsCard data={data.singleData} />;
}

export async function getStaticProps(context) {
  const dataId = context.params.dataId;

  try {
    const data = await getSingleData(dataId);
    return {
      props: {
        selectedData: data,
      },
      revalidate: 60,
    };
  } catch (error) {
    return {
      props: {
        selectedData: null,
      },
      revalidate: 60,
    };
  }
}

export async function getStaticPaths() {
  const firstPageDataIds = await getDataIds();

  console.log(firstPageDataIds);
  const paths = firstPageDataIds.dataIds.map((id) => ({
    params: { dataId: id },
  }));

  return {
    paths: paths,
    fallback: 'blocking',
  };
}

export default SignelDataPage;